<!DOCTYPE html>
<html class="pixel-ratio-2 retina android android-6 android-6-0">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no, minimal-ui" />
    <meta content="yes" name="apple-mobile-web-app-capable" />
    <meta content="black" name="apple-mobile-web-app-status-bar-style" />
    <meta name="format-detection" content="telephone=no" />
    <title>首页</title>
    <link rel="stylesheet" href="assets/css/style.css">
	<link rel="stylesheet" href="assets/css/mui.min.css">
	<link rel="stylesheet" href="assets/font/iconfont.css">
	<script src="assets/js/vue.min.js"></script>
	<script src="assets/js/mui.min.js"></script>
	<script src="assets/js/common.js"></script>
	<script src="UpGw/utils.js"></script>
	<script src="assets/js/Bluetooth.js"></script>
	<script src="assets/js/Box.js"></script>
	<script src="assets/js/dataBase.js"></script>
	<script src="UpGw/utils.js"></script>
	<script src="UpGw/data.js"></script>
	<script src="UpGw/decimal.js"></script>
	<script src="UpGw/UpGw.js"></script>
	
</head>
	<body>
		<div id="H5_MUI">
			<!-- 弹出层 -->
			<div class="mask" v-show="showMask" v-on:click="hidePop()"></div>
			<div id="popup" class="popup" v-show="popUp" >
				<div class="popup-cal" v-on:click="popCancel()"><i class="iconfont fs15">&#xe667;</i></div>
				<div class="popup-tab">任务执行</div>
				<p style="height: 2px;"></p>
				<div class="popup-content-ms" id="scrolldIV">
					<div class="popup-list" v-show="eventErr !== ''">
						<li class="popup-title">{{eventErr}}</li>
					</div>
					<ul id="getResult"  class="get-res"></ul>
					<div id="btnDiv"></div>
				</div>
				<div class="btn-div" >
					<button type="button" class="mui-btn" style="background-color: #00796B;color: #FFFFFF;" v-on:click="hidePop()"> 取消 </button>
				</div>
			</div>
			<!-- 标题栏 -->
			<div class="navigation-bar">
				<div class="navigation-bar-title">表箱管理</div>
				<div class="navigation-left">
					<div class="navigation-left-title" v-on:click="CommonUtil.clicked('index.html','首页')"><li class="iconfont fs16">&#xe644;</li></div>
				</div>
				<div class="navigation-right" >
					<!-- 执行 -->
					<div class="navigation-right-title" v-on:click="sendData()">
						<i class="iconfont fs16">&#xe784;</i>
					</div>
					<!-- 删除全部 -->
					<div class="navigation-right-title" v-on:click="delAll()">
						<i class="iconfont fs15">&#xe62d;</i>
					</div>
				</div>
			</div>
			<!--  -->
			<div class="search-input-view" >
				<div class="search-input-icon">
					<i class="iconfont">&#xe608;</i>
				</div>
				<div class="search-input-input">
					<input type="input" class="input-clear" style="width: 100%;height: 38px;line-height: 38px;font-size: 14px;color: #333333;" placeholder="搜索">
				</div>
			<!-- 	<div class="search-input-btn"  >搜索</div> -->
			</div>
			<!-- 选项卡tab-bar -->
				<div class="tab-bar">
					<div class="tab-bar-active" v-on:click="CommonUtil.clicked('box.html','表箱列表')">表箱列表</div>
					<div class="tab-bar-cell "  v-on:click="CommonUtil.clicked('branchBox.html','分支箱列表')">分支箱列表</div>
					<div class="tab-bar-cell " v-on:click="CommonUtil.clicked('meterBox.html','表箱电表')">表箱电表</div>
				</div>
			<!-- 内容 -->
			<div class="content c-title" >
				<div class="title-cell" >
					<div class="title-cell-view" style="width: 14%;">序号</div>
					<div class="title-cell-view" style="width: 30%;">表箱地址</div>
					<div class="title-cell-view" style="width: 30%;">父地址</div>
					<div class="title-cell-view" style="width: 10%;">变比</div>
					<div class="title-cell-view" style="width: 16%;">相位</div>
				</div>
			</div>
			<div class="mui-content mui-content-pu" style="margin-top: 165px;">
				<ul class="mui-table-view">
					<li class="mui-table-view-cell"  v-for="(box,key) in boxList" :key = "key"  >
							<div  class="mui-pull-left"  style="width: 6%;"><i class="iconfont icon colorA fs16">&#xe649;</i></div>
							<div  class="mui-pull-left" style="width: 8%;" >{{box.BoxNo}}</div>
							<div  class="mui-pull-left" style="width: 30%;color: #00796B;" >{{box.BoxAddr}}</div>
							<div  class="mui-pull-left" style="width: 30%;" >{{box.ParentAddr}}</div>
							<div  class="mui-pull-left" style="width: 10%;" >{{box.CT}}</div>
							<div  class="mui-pull-left" style="width: 16%;" >{{UpGw.WiringId.properties[box.WiringId].name}}</div>
					</li>
				</ul>
			</div>
			<!--  -->
			<div class="count" >
				共 <span style="color: #00796B;font-size: 16px;">{{dataCount}}</span> 条数据
			</div>
		</div>
	</body>
</html>
<script>
	// 初始化
	var vm = new Vue({
		el: '#H5_MUI',
		data: {
			collectAddr:'000000000000',
			popUp:false,
			showMask:false,
			keyStr:'',
			eventErr:'',
			bleErr:'',
			interval:'',
			result:'',
			boxList:[],
			timer:'',
			dataCount:'',//列表数据统计
			con:'getResult',//消息容器
			eleLI:'LI',
			eleUL:'UL',
			va:3,//单包数量
			maxVa:500,//最大测量点
		},
		created: function () {
			this.plusReady();
		},
		methods: {
			plusReady:function(){
				var that = this;
				document.addEventListener('plusready', function(){
					that.collectAddr = CommonUtil.getStorage('selCollectAddr');
					//蓝牙模块状态监听
					BLE.getBluetoothState(function(data){if(data == 'suceess') this.bleStateChangeIcon = '\uec4a'; 
						if(data == 'fail') that.bleErr = 'unlink';
					});
					//蓝牙设备链接状态监听
					BLE.BLEConnectionStateChange(function(data){
						if(!data.connected) that.bleErr = 'unlink';
					});
					//创建Box表
					let fieldStr = '("CollectAddr" CHAR(110),"BoxAddr" CHAR(100),"BoxNo" INTEGER,"ParentAddr"  CHAR(100),"CT" INTEGER,"WiringId"  INTEGER)';
					DB.createTable('Box',fieldStr,function(data){});
					//搜索所有的终端下电表
					that.updateList();
					that.getDataCout();
				},false);
			},
			sendData:function(){
				let that = this;
				that.popUp = true;
				that.showMask = true;
				document.getElementById("getResult").innerHTML="";
				if(that.bleErr == 'unlink') that.eventErr = "蓝牙未连接......";
				if(CommonUtil.getStorage('mac')  == '') that.eventErr = "蓝牙未连接......";
				var up = new UpGw();
				var buffer1;
				let da = 1;
				if(this.eventErr ==''){
					this.timer = setInterval(function() {
						let para = new TPara(0, 60);
						para.add("数量", that.va, Fmt.Bin2);
						
						CommonUtil.createElementHTML(that.eleLI,"查询序号"+da+"至"+(da+that.va),that.con);
						for(let xh = da ;xh<da+that.va;xh++){
							console.log('序号'+xh);
							para.add("序号"+xh, xh, Fmt.Bin2);
						}
						var task = new Task(that.collectAddr, UpGw.Afn.GetData1, para);
						buffer1 = up.build(task)
						console.log("build " + Util.bytesToStr(buffer1));
					// 	//sendata
						let buffer =  Util.bytesToStr(buffer1);
						let str = "发送成功::->" + buffer;
						CommonUtil.createElementHTML(that.eleLI,str,that.con);
						
						BLE.sendBuffer(buffer,function(data) {})
						BLE.onBLECharacteristicValueChange(that.va,function(data) {
							
							let getData = "接收成功::<-" + data;
							CommonUtil.createElementHTML(that.eleLI,getData,that.con);
							var xb = new XBuffer(Util.strToBytes(data));
							let buffer1 = up.searchValid(xb.bytes, xb.bytes.length);
							if (buffer1) log("valid = " + Util.bytesToStr(buffer1));
							
							xb = new XBuffer(buffer1);
							var result = up.parse(task, xb);
							console.log(JSON.stringify(result));
							
							CommonUtil.createElementHTML(that.eleUL,result.title,that.con);
							if (result.datas) {
								for (let i = 1; i < result.datas.length; i++) {
									let data = result.datas[i];
									let item = data.key +"::"+data.val;
									CommonUtil.createElementHTML(that.eleUL,item,that.con);
									console.log("parse " + data.key + " " + data.val);
								}
							}
							
							
						});
						
						let btnDiv = document.getElementById("btnDiv");
						btnDiv.scrollIntoView();
						da = da + that.va;
						Util.progressbar(mui("#popup p"),da,that.maxVa);
						if(da === that.maxVa) clearInterval(that.timer);
					}, that.va*1000);
				}
				
			},
			hidePop:function(){
				clearInterval(this.interval)
				clearInterval(this.timer);
				this.updateList();
				this.getDataCout();
			},
			popCancel:function(){
				this.showMask = false;
				this.popUp = false;
				clearInterval(this.interval)
				clearInterval(this.timer);
				this.updateList();
				this.getDataCout();
			},
			getDataCout:function(){
				///数量
				let that = this;
				DB.selectSQL("select count(*) as Count from Box where CollectAddr = '"+that.collectAddr+"' and WiringId <> 4",function(data){
					that.dataCount = data[0].Count;
					//console.log(JSON.stringify(data));
				})
			},
			updateList:function(){
				//所有记录
				let that = this;
				let sqlStr = "select * from Box where CollectAddr = '"+that.collectAddr+"' and WiringId <> 4";
				DB.selectSQL(sqlStr,function(data){
					that.boxList = data;
				})
			},
			delAll:function(){
				let that = this;
				DB.deleteSQL("DELETE FROM Box WHERE CollectAddr = '"+this.collectAddr+"' and WiringId <> 4",function(data){
					if(data == 'success'){
						mui.toast('全部删除成功');
						that.boxList=[];
						that.dataCount = 0;
					}
					if(data == 'fail'){
						mui.toast('全部删除失败');
					}
				})
			}
		}
	})
	 
</script>
